<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Welcome to clj-gallery</title>
    <link rel="stylesheet" href="{{context}}/css/screen.css">
    <script>
        var context = "{{context}}";
    </script>
</head>
<body>

{% block menu %}
<div id="usermenu">
    <div class="menuitem"><a href="/">home</a></div>
    {% if user %}
    <div class="menuitem"><a href="/upload">upload images</a></div>
    <div class="menuitem"><a href="/logout">logout {{user}}</a></div>
    <div class="menuitem"><a href="/delete-account">delete account</a></div>
    {% else %}
    <div class="menuitem">
        <a href="{{context}}/register">register</a>
    </div>
    <div class="menuitem">
        <form action="{{context}}/login" method="post">
            <input type="text" name="id" id="id" placeholder="screen name">
            <input type="password" name="pass" id="pass" placeholder="password">
            <input type="submit" value="login">
        </form>
    </div>
    {% endif %}
</div>
{% endblock %}

{% block content %}Main Content{% endblock %}

<script src="{{context}}/js/jquery.min.js"></script>
<script src="{{context}}/js/albumcolors.js"></script>
<script src="{{context}}/js/gallery-cljs.js"></script>
<script>site.init();</script>

{% block user-scripts %}{% endblock %}

</body>
</html>